
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>IconFont</title>
    <link rel="stylesheet" href="demo.css">
    <script src="iconfont.js"></script>

    <style type="text/css">
        .icon {
          /* 通过设置 font-size 来改变图标大小 */
          width: 1em; height: 1em;
          /* 图标和文字相邻时，垂直对齐 */
          vertical-align: -0.15em;
          /* 通过设置 color 来改变 SVG 的颜色/fill */
          fill: currentColor;
          /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
             normalize.css 中也包含这行 */
          overflow: hidden;
        }

    </style>
</head>
<body>
    <div class="main markdown">
        <h1>IconFont 图标</h1>
        <ul class="icon_lists clear">
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wendang"></use>
                    </svg>
                    <div class="name">文档</div>
                    <div class="fontclass">#icon-wendang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zitidaxiaoim"></use>
                    </svg>
                    <div class="name">字体大小-im</div>
                    <div class="fontclass">#icon-zitidaxiaoim</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-msnui-report-data"></use>
                    </svg>
                    <div class="name">数据分析</div>
                    <div class="fontclass">#icon-msnui-report-data</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fuzhi"></use>
                    </svg>
                    <div class="name">复制</div>
                    <div class="fontclass">#icon-fuzhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-caozuoxunhuan"></use>
                    </svg>
                    <div class="name">操作_循环</div>
                    <div class="fontclass">#icon-caozuoxunhuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-caidan"></use>
                    </svg>
                    <div class="name">菜单</div>
                    <div class="fontclass">#icon-caidan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shouye"></use>
                    </svg>
                    <div class="name">首页</div>
                    <div class="fontclass">#icon-shouye</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-three-people"></use>
                    </svg>
                    <div class="name">层级分配</div>
                    <div class="fontclass">#icon-three-people</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-iconfontfenxiang"></use>
                    </svg>
                    <div class="name">分享</div>
                    <div class="fontclass">#icon-iconfontfenxiang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-search2"></use>
                    </svg>
                    <div class="name">search2</div>
                    <div class="fontclass">#icon-search2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-order-time"></use>
                    </svg>
                    <div class="name">就诊时间</div>
                    <div class="fontclass">#icon-order-time</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiangshang"></use>
                    </svg>
                    <div class="name">向上</div>
                    <div class="fontclass">#icon-xiangshang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiangxia"></use>
                    </svg>
                    <div class="name">向下</div>
                    <div class="fontclass">#icon-xiangxia</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiangxia1"></use>
                    </svg>
                    <div class="name">向下</div>
                    <div class="fontclass">#icon-xiangxia1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jichushuju"></use>
                    </svg>
                    <div class="name">基础数据</div>
                    <div class="fontclass">#icon-jichushuju</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-huiyuanfenzu"></use>
                    </svg>
                    <div class="name">会员分组</div>
                    <div class="fontclass">#icon-huiyuanfenzu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shitifenzu"></use>
                    </svg>
                    <div class="name">实体分组</div>
                    <div class="fontclass">#icon-shitifenzu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fenpei"></use>
                    </svg>
                    <div class="name">分配</div>
                    <div class="fontclass">#icon-fenpei</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-qq"></use>
                    </svg>
                    <div class="name">QQ</div>
                    <div class="fontclass">#icon-qq</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-mingdanfenpei"></use>
                    </svg>
                    <div class="name">名单分配</div>
                    <div class="fontclass">#icon-mingdanfenpei</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-iconset0398"></use>
                    </svg>
                    <div class="name">雷达</div>
                    <div class="fontclass">#icon-iconset0398</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-iconset0403"></use>
                    </svg>
                    <div class="name">地球</div>
                    <div class="fontclass">#icon-iconset0403</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-iconset0422"></use>
                    </svg>
                    <div class="name">向上</div>
                    <div class="fontclass">#icon-iconset0422</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shuoming"></use>
                    </svg>
                    <div class="name">说明</div>
                    <div class="fontclass">#icon-shuoming</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-houtui"></use>
                    </svg>
                    <div class="name">后退</div>
                    <div class="fontclass">#icon-houtui</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-qianjin"></use>
                    </svg>
                    <div class="name">前进</div>
                    <div class="fontclass">#icon-qianjin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-weixin1"></use>
                    </svg>
                    <div class="name">微信</div>
                    <div class="fontclass">#icon-weixin1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-iconfontxiaogantanhao"></use>
                    </svg>
                    <div class="name">感叹号</div>
                    <div class="fontclass">#icon-iconfontxiaogantanhao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-peizhi"></use>
                    </svg>
                    <div class="name">配置</div>
                    <div class="fontclass">#icon-peizhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-weibiaoti6"></use>
                    </svg>
                    <div class="name">外部数据</div>
                    <div class="fontclass">#icon-weibiaoti6</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xuanze"></use>
                    </svg>
                    <div class="name">选择</div>
                    <div class="fontclass">#icon-xuanze</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-weibiaoti38"></use>
                    </svg>
                    <div class="name">圆</div>
                    <div class="fontclass">#icon-weibiaoti38</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dakaiopen127"></use>
                    </svg>
                    <div class="name">打开</div>
                    <div class="fontclass">#icon-dakaiopen127</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jiantouarrow485"></use>
                    </svg>
                    <div class="name">箭头</div>
                    <div class="fontclass">#icon-jiantouarrow485</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jiantouarrow496"></use>
                    </svg>
                    <div class="name">箭头</div>
                    <div class="fontclass">#icon-jiantouarrow496</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wendangdocument81"></use>
                    </svg>
                    <div class="name">文档</div>
                    <div class="fontclass">#icon-wendangdocument81</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wendangdocument83"></use>
                    </svg>
                    <div class="name">文档</div>
                    <div class="fontclass">#icon-wendangdocument83</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-21shengyin"></use>
                    </svg>
                    <div class="name">21_声音</div>
                    <div class="fontclass">#icon-21shengyin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-30xuanzhongfangxing"></use>
                    </svg>
                    <div class="name">30_选中方形</div>
                    <div class="fontclass">#icon-30xuanzhongfangxing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-weixin"></use>
                    </svg>
                    <div class="name">微信</div>
                    <div class="fontclass">#icon-weixin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-33"></use>
                    </svg>
                    <div class="name">锁定</div>
                    <div class="fontclass">#icon-33</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-17"></use>
                    </svg>
                    <div class="name">类型</div>
                    <div class="fontclass">#icon-17</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zhuxingtu"></use>
                    </svg>
                    <div class="name">柱形图</div>
                    <div class="fontclass">#icon-zhuxingtu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jifenshangcheng"></use>
                    </svg>
                    <div class="name">积分商城</div>
                    <div class="fontclass">#icon-jifenshangcheng</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-leida"></use>
                    </svg>
                    <div class="name">监测数据</div>
                    <div class="fontclass">#icon-leida</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shujuzidingyishezhi"></use>
                    </svg>
                    <div class="name">数据定义</div>
                    <div class="fontclass">#icon-shujuzidingyishezhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fabu"></use>
                    </svg>
                    <div class="name">发布</div>
                    <div class="fontclass">#icon-fabu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wanggeshitu"></use>
                    </svg>
                    <div class="name">网格视图</div>
                    <div class="fontclass">#icon-wanggeshitu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-guanxishujuku"></use>
                    </svg>
                    <div class="name">关系数据库</div>
                    <div class="fontclass">#icon-guanxishujuku</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wendang2"></use>
                    </svg>
                    <div class="name">文档</div>
                    <div class="fontclass">#icon-wendang2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zhiyuanshuaxin4"></use>
                    </svg>
                    <div class="name">指缘刷新4</div>
                    <div class="fontclass">#icon-zhiyuanshuaxin4</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-icon-audit"></use>
                    </svg>
                    <div class="name">多级审批</div>
                    <div class="fontclass">#icon-icon-audit</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-icon-goods"></use>
                    </svg>
                    <div class="name">物品管理</div>
                    <div class="fontclass">#icon-icon-goods</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shujuwenjian"></use>
                    </svg>
                    <div class="name">数据文件</div>
                    <div class="fontclass">#icon-shujuwenjian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wechat"></use>
                    </svg>
                    <div class="name">微信</div>
                    <div class="fontclass">#icon-wechat</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-suyaniconchanpinleibufenzuodaohangbufen84"></use>
                    </svg>
                    <div class="name">数据库</div>
                    <div class="fontclass">#icon-suyaniconchanpinleibufenzuodaohangbufen84</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-ditu"></use>
                    </svg>
                    <div class="name">地图</div>
                    <div class="fontclass">#icon-ditu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shanchu"></use>
                    </svg>
                    <div class="name">删除</div>
                    <div class="fontclass">#icon-shanchu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-selected-copy"></use>
                    </svg>
                    <div class="name">选中</div>
                    <div class="fontclass">#icon-selected-copy</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-chakan"></use>
                    </svg>
                    <div class="name">查看</div>
                    <div class="fontclass">#icon-chakan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yidongyunkongzhitaiicon41"></use>
                    </svg>
                    <div class="name">并行数据挖掘</div>
                    <div class="fontclass">#icon-yidongyunkongzhitaiicon41</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zhanneisousuo"></use>
                    </svg>
                    <div class="name">站内搜索</div>
                    <div class="fontclass">#icon-zhanneisousuo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fenxiang"></use>
                    </svg>
                    <div class="name">分享</div>
                    <div class="fontclass">#icon-fenxiang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-guanxi"></use>
                    </svg>
                    <div class="name">关系</div>
                    <div class="fontclass">#icon-guanxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-ditu3"></use>
                    </svg>
                    <div class="name">地图</div>
                    <div class="fontclass">#icon-ditu3</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-chakansousuodingdan"></use>
                    </svg>
                    <div class="name">查看搜索订单</div>
                    <div class="fontclass">#icon-chakansousuodingdan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-attribute"></use>
                    </svg>
                    <div class="name">属性</div>
                    <div class="fontclass">#icon-attribute</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-Kafka"></use>
                    </svg>
                    <div class="name">Kafka</div>
                    <div class="fontclass">#icon-Kafka</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-guanlian"></use>
                    </svg>
                    <div class="name">关联</div>
                    <div class="fontclass">#icon-guanlian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tuandui"></use>
                    </svg>
                    <div class="name">团队</div>
                    <div class="fontclass">#icon-tuandui</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shitixingwei"></use>
                    </svg>
                    <div class="name">实体行为</div>
                    <div class="fontclass">#icon-shitixingwei</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shitiguanxi"></use>
                    </svg>
                    <div class="name">实体关系</div>
                    <div class="fontclass">#icon-shitiguanxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tongbujichengshuxing"></use>
                    </svg>
                    <div class="name">同步继承属性</div>
                    <div class="fontclass">#icon-tongbujichengshuxing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-lishiyunxingjilu"></use>
                    </svg>
                    <div class="name">历史运行记录</div>
                    <div class="fontclass">#icon-lishiyunxingjilu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xitongshiticaozuobiaoshi"></use>
                    </svg>
                    <div class="name">系统实体操作标识</div>
                    <div class="fontclass">#icon-xitongshiticaozuobiaoshi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xitongzuzhileixing"></use>
                    </svg>
                    <div class="name">系统组织类型</div>
                    <div class="fontclass">#icon-xitongzuzhileixing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wuuiconsuoxiao"></use>
                    </svg>
                    <div class="name">减</div>
                    <div class="fontclass">#icon-wuuiconsuoxiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-big-WeChat"></use>
                    </svg>
                    <div class="name">微信</div>
                    <div class="fontclass">#icon-big-WeChat</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiazai"></use>
                    </svg>
                    <div class="name">下载</div>
                    <div class="fontclass">#icon-xiazai</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wenjianjia1"></use>
                    </svg>
                    <div class="name">文件夹</div>
                    <div class="fontclass">#icon-wenjianjia1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-iconfontpaixingbang"></use>
                    </svg>
                    <div class="name">数据</div>
                    <div class="fontclass">#icon-iconfontpaixingbang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tuxiang1"></use>
                    </svg>
                    <div class="name">图像1</div>
                    <div class="fontclass">#icon-tuxiang1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shangcheng1"></use>
                    </svg>
                    <div class="name">商城1</div>
                    <div class="fontclass">#icon-shangcheng1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fangda"></use>
                    </svg>
                    <div class="name">放大</div>
                    <div class="fontclass">#icon-fangda</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shezhi1"></use>
                    </svg>
                    <div class="name">设置</div>
                    <div class="fontclass">#icon-shezhi1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shebeileijiankongdianbaojing"></use>
                    </svg>
                    <div class="name">设备类_监控点报警</div>
                    <div class="fontclass">#icon-shebeileijiankongdianbaojing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shebeileijiankongdianbaojingbingbofang"></use>
                    </svg>
                    <div class="name">设备类_监控点报警并播放</div>
                    <div class="fontclass">#icon-shebeileijiankongdianbaojingbingbofang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tongyongleixunchaluxian"></use>
                    </svg>
                    <div class="name">通用类_巡查路线</div>
                    <div class="fontclass">#icon-tongyongleixunchaluxian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tongyongleizudakai"></use>
                    </svg>
                    <div class="name">通用类_组（打开） </div>
                    <div class="fontclass">#icon-tongyongleizudakai</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-chenggong"></use>
                    </svg>
                    <div class="name">成功</div>
                    <div class="fontclass">#icon-chenggong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shuju"></use>
                    </svg>
                    <div class="name">数据</div>
                    <div class="fontclass">#icon-shuju</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-bhjlink"></use>
                    </svg>
                    <div class="name">办会家_连接</div>
                    <div class="fontclass">#icon-bhjlink</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-iconfontzhizuobiaozhun023103"></use>
                    </svg>
                    <div class="name">发现</div>
                    <div class="fontclass">#icon-iconfontzhizuobiaozhun023103</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fuwenben"></use>
                    </svg>
                    <div class="name">富文本</div>
                    <div class="fontclass">#icon-fuwenben</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shuxing"></use>
                    </svg>
                    <div class="name">属性</div>
                    <div class="fontclass">#icon-shuxing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-gongzuotai"></use>
                    </svg>
                    <div class="name">工作台</div>
                    <div class="fontclass">#icon-gongzuotai</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jian"></use>
                    </svg>
                    <div class="name">减</div>
                    <div class="fontclass">#icon-jian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-diqiu1"></use>
                    </svg>
                    <div class="name">地球</div>
                    <div class="fontclass">#icon-diqiu1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jia1"></use>
                    </svg>
                    <div class="name">加</div>
                    <div class="fontclass">#icon-jia1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-3sousuo2"></use>
                    </svg>
                    <div class="name">3搜索2</div>
                    <div class="fontclass">#icon-3sousuo2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zengjia"></use>
                    </svg>
                    <div class="name">增加</div>
                    <div class="fontclass">#icon-zengjia</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-weizhi"></use>
                    </svg>
                    <div class="name">位置</div>
                    <div class="fontclass">#icon-weizhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-lishijilu"></use>
                    </svg>
                    <div class="name">历史记录</div>
                    <div class="fontclass">#icon-lishijilu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-icon-dianjiduobianxing"></use>
                    </svg>
                    <div class="name">点击选多边形</div>
                    <div class="fontclass">#icon-icon-dianjiduobianxing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shishishuju"></use>
                    </svg>
                    <div class="name">实时数据</div>
                    <div class="fontclass">#icon-shishishuju</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-gaojingxinxi"></use>
                    </svg>
                    <div class="name">账号异常</div>
                    <div class="fontclass">#icon-gaojingxinxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiaoxi"></use>
                    </svg>
                    <div class="name">消息</div>
                    <div class="fontclass">#icon-xiaoxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-icon-sanjiao"></use>
                    </svg>
                    <div class="name">三角形</div>
                    <div class="fontclass">#icon-icon-sanjiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-plus-gridview"></use>
                    </svg>
                    <div class="name">网格</div>
                    <div class="fontclass">#icon-plus-gridview</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-icon-lujingguanli"></use>
                    </svg>
                    <div class="name">路径管理</div>
                    <div class="fontclass">#icon-icon-lujingguanli</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-bianji"></use>
                    </svg>
                    <div class="name">编辑</div>
                    <div class="fontclass">#icon-bianji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-baojingshezhi"></use>
                    </svg>
                    <div class="name">报警设置</div>
                    <div class="fontclass">#icon-baojingshezhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shujukubiao"></use>
                    </svg>
                    <div class="name">数据库表</div>
                    <div class="fontclass">#icon-shujukubiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jichushujuguanli"></use>
                    </svg>
                    <div class="name">基础数据管理</div>
                    <div class="fontclass">#icon-jichushujuguanli</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-bianji1"></use>
                    </svg>
                    <div class="name">编辑</div>
                    <div class="fontclass">#icon-bianji1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-peizhishujuyuan"></use>
                    </svg>
                    <div class="name">配置数据源</div>
                    <div class="fontclass">#icon-peizhishujuyuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tuandui1"></use>
                    </svg>
                    <div class="name">团队</div>
                    <div class="fontclass">#icon-tuandui1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wendang3"></use>
                    </svg>
                    <div class="name">文档</div>
                    <div class="fontclass">#icon-wendang3</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jichushuju1"></use>
                    </svg>
                    <div class="name">基础数据</div>
                    <div class="fontclass">#icon-jichushuju1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shenpi"></use>
                    </svg>
                    <div class="name">审批</div>
                    <div class="fontclass">#icon-shenpi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fenxiang1"></use>
                    </svg>
                    <div class="name">分享</div>
                    <div class="fontclass">#icon-fenxiang1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zhanghaoguanli"></use>
                    </svg>
                    <div class="name">人物-账号管理</div>
                    <div class="fontclass">#icon-zhanghaoguanli</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shujujuzhen"></use>
                    </svg>
                    <div class="name">符号-数据矩阵</div>
                    <div class="fontclass">#icon-shujujuzhen</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wenzi"></use>
                    </svg>
                    <div class="name">文字</div>
                    <div class="fontclass">#icon-wenzi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-SQLshujuji"></use>
                    </svg>
                    <div class="name">SQL数据集</div>
                    <div class="fontclass">#icon-SQLshujuji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-hebingdanyuange"></use>
                    </svg>
                    <div class="name">合并单元格</div>
                    <div class="fontclass">#icon-hebingdanyuange</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-quxiaohebingdanyuange"></use>
                    </svg>
                    <div class="name">取消合并单元格</div>
                    <div class="fontclass">#icon-quxiaohebingdanyuange</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shujuku1"></use>
                    </svg>
                    <div class="name">数据库</div>
                    <div class="fontclass">#icon-shujuku1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fenzu"></use>
                    </svg>
                    <div class="name">分组</div>
                    <div class="fontclass">#icon-fenzu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-lianjiequzhong"></use>
                    </svg>
                    <div class="name">链接去重</div>
                    <div class="fontclass">#icon-lianjiequzhong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-huaxiangfenxi"></use>
                    </svg>
                    <div class="name">画像分析</div>
                    <div class="fontclass">#icon-huaxiangfenxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shujushitu"></use>
                    </svg>
                    <div class="name">数据视图</div>
                    <div class="fontclass">#icon-shujushitu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yusuanzuheleixing"></use>
                    </svg>
                    <div class="name">预算组合类型</div>
                    <div class="fontclass">#icon-yusuanzuheleixing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-guanxitu"></use>
                    </svg>
                    <div class="name">关系图</div>
                    <div class="fontclass">#icon-guanxitu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-institute"></use>
                    </svg>
                    <div class="name">机构关系</div>
                    <div class="fontclass">#icon-institute</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dmsshujukuguanli"></use>
                    </svg>
                    <div class="name">dms数据库管理</div>
                    <div class="fontclass">#icon-dmsshujukuguanli</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-HybridDByunshujuku"></use>
                    </svg>
                    <div class="name">HybridDB云数据库</div>
                    <div class="fontclass">#icon-HybridDByunshujuku</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-NoSQLshujukuMemcache"></use>
                    </svg>
                    <div class="name">云数据库 Memcache 版</div>
                    <div class="fontclass">#icon-NoSQLshujukuMemcache</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-NoSQLshujukumongodb"></use>
                    </svg>
                    <div class="name">云数据库 MongoDB版</div>
                    <div class="fontclass">#icon-NoSQLshujukumongodb</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-NoSQLshujukuredis"></use>
                    </svg>
                    <div class="name">云数据库 redis</div>
                    <div class="fontclass">#icon-NoSQLshujukuredis</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-drdsfenbushiguanxixingshujukufuwu"></use>
                    </svg>
                    <div class="name">drds分布式关系型数据库服务</div>
                    <div class="fontclass">#icon-drdsfenbushiguanxixingshujukufuwu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-ditudingwei"></use>
                    </svg>
                    <div class="name">地图定位</div>
                    <div class="fontclass">#icon-ditudingwei</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shuaxin"></use>
                    </svg>
                    <div class="name">刷新</div>
                    <div class="fontclass">#icon-shuaxin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shujuchaxun"></use>
                    </svg>
                    <div class="name">数据查询</div>
                    <div class="fontclass">#icon-shujuchaxun</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dituzhaofang"></use>
                    </svg>
                    <div class="name">地图找房</div>
                    <div class="fontclass">#icon-dituzhaofang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-entity"></use>
                    </svg>
                    <div class="name">实体关系</div>
                    <div class="fontclass">#icon-entity</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-align-bottom"></use>
                    </svg>
                    <div class="name">底对齐</div>
                    <div class="fontclass">#icon-align-bottom</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-cheliang-"></use>
                    </svg>
                    <div class="name">车辆-01</div>
                    <div class="fontclass">#icon-cheliang-</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-duomeit"></use>
                    </svg>
                    <div class="name">多媒体文件</div>
                    <div class="fontclass">#icon-duomeit</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shanchuwendang"></use>
                    </svg>
                    <div class="name">删除文档</div>
                    <div class="fontclass">#icon-shanchuwendang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-gaojixuanren"></use>
                    </svg>
                    <div class="name">人物-高级选人</div>
                    <div class="fontclass">#icon-gaojixuanren</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fenxianglianjie"></use>
                    </svg>
                    <div class="name">分享链接</div>
                    <div class="fontclass">#icon-fenxianglianjie</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiangxia2"></use>
                    </svg>
                    <div class="name">向下</div>
                    <div class="fontclass">#icon-xiangxia2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiangshang1"></use>
                    </svg>
                    <div class="name">向上</div>
                    <div class="fontclass">#icon-xiangshang1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-hitsdb"></use>
                    </svg>
                    <div class="name">hitsdb 时序数据库.</div>
                    <div class="fontclass">#icon-hitsdb</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wenbenkuai"></use>
                    </svg>
                    <div class="name">文本块</div>
                    <div class="fontclass">#icon-wenbenkuai</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-hbase"></use>
                    </svg>
                    <div class="name">hbase 云数据库 HBase 版</div>
                    <div class="fontclass">#icon-hbase</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jigou_wushuju"></use>
                    </svg>
                    <div class="name">机构_无数据</div>
                    <div class="fontclass">#icon-jigou_wushuju</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shujucaiji"></use>
                    </svg>
                    <div class="name">数据采集</div>
                    <div class="fontclass">#icon-shujucaiji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-gongzuorizhi"></use>
                    </svg>
                    <div class="name">工作日志</div>
                    <div class="fontclass">#icon-gongzuorizhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-Redisshujuku"></use>
                    </svg>
                    <div class="name">Redis 数据库</div>
                    <div class="fontclass">#icon-Redisshujuku</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-renliziyuanzhutifenxi"></use>
                    </svg>
                    <div class="name">人力资源主题分析</div>
                    <div class="fontclass">#icon-renliziyuanzhutifenxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fuhefenxi"></use>
                    </svg>
                    <div class="name">负荷分析</div>
                    <div class="fontclass">#icon-fuhefenxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-gaojingyilan"></use>
                    </svg>
                    <div class="name">告警一览</div>
                    <div class="fontclass">#icon-gaojingyilan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tishikuang"></use>
                    </svg>
                    <div class="name">提示框</div>
                    <div class="fontclass">#icon-tishikuang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-guanlian1"></use>
                    </svg>
                    <div class="name">关联</div>
                    <div class="fontclass">#icon-guanlian1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-adam"></use>
                    </svg>
                    <div class="name">adam 数据库和应用迁移</div>
                    <div class="fontclass">#icon-adam</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-weixing"></use>
                    </svg>
                    <div class="name">卫星</div>
                    <div class="fontclass">#icon-weixing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-chakan1"></use>
                    </svg>
                    <div class="name">查看</div>
                    <div class="fontclass">#icon-chakan1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-quanbu"></use>
                    </svg>
                    <div class="name">全部</div>
                    <div class="fontclass">#icon-quanbu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiangji"></use>
                    </svg>
                    <div class="name">相机</div>
                    <div class="fontclass">#icon-xiangji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-riqi"></use>
                    </svg>
                    <div class="name">日期</div>
                    <div class="fontclass">#icon-riqi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiaoxi1"></use>
                    </svg>
                    <div class="name">消息</div>
                    <div class="fontclass">#icon-xiaoxi1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-suoding"></use>
                    </svg>
                    <div class="name">锁定</div>
                    <div class="fontclass">#icon-suoding</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shanchu1"></use>
                    </svg>
                    <div class="name">删除</div>
                    <div class="fontclass">#icon-shanchu1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tuceng"></use>
                    </svg>
                    <div class="name">图层</div>
                    <div class="fontclass">#icon-tuceng</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shezhi2"></use>
                    </svg>
                    <div class="name">设置</div>
                    <div class="fontclass">#icon-shezhi2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zhuanyiluxian"></use>
                    </svg>
                    <div class="name">转移路线</div>
                    <div class="fontclass">#icon-zhuanyiluxian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fangxunxingshibushu"></use>
                    </svg>
                    <div class="name">防汛形势部署</div>
                    <div class="fontclass">#icon-fangxunxingshibushu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shishishujuzhanshi"></use>
                    </svg>
                    <div class="name">实时数据展示</div>
                    <div class="fontclass">#icon-shishishujuzhanshi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-daohang-tuiguanglianjie"></use>
                    </svg>
                    <div class="name">导航-推广链接</div>
                    <div class="fontclass">#icon-daohang-tuiguanglianjie</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-daohang-xiaoshuoliebiao"></use>
                    </svg>
                    <div class="name">导航-小说列表</div>
                    <div class="fontclass">#icon-daohang-xiaoshuoliebiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-daohang-gongzhonghaotixing"></use>
                    </svg>
                    <div class="name">导航-公众号设置</div>
                    <div class="fontclass">#icon-daohang-gongzhonghaotixing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-polardb"></use>
                    </svg>
                    <div class="name">云数据库POLARDB</div>
                    <div class="fontclass">#icon-polardb</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-weixing1"></use>
                    </svg>
                    <div class="name">卫星</div>
                    <div class="fontclass">#icon-weixing1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-renyuanguanli1"></use>
                    </svg>
                    <div class="name">人员管理</div>
                    <div class="fontclass">#icon-renyuanguanli1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-daba"></use>
                    </svg>
                    <div class="name">实物-大巴</div>
                    <div class="fontclass">#icon-daba</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-feiji"></use>
                    </svg>
                    <div class="name">实物-飞机</div>
                    <div class="fontclass">#icon-feiji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shiwu-zuoji"></use>
                    </svg>
                    <div class="name">实物-座机</div>
                    <div class="fontclass">#icon-shiwu-zuoji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-erji-lujingguanli"></use>
                    </svg>
                    <div class="name">二级-路径管理</div>
                    <div class="fontclass">#icon-erji-lujingguanli</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shouye1"></use>
                    </svg>
                    <div class="name">首页</div>
                    <div class="fontclass">#icon-shouye1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-selected"></use>
                    </svg>
                    <div class="name">选中</div>
                    <div class="fontclass">#icon-selected</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-renyuanguanli"></use>
                    </svg>
                    <div class="name">人员管理</div>
                    <div class="fontclass">#icon-renyuanguanli</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shouji1"></use>
                    </svg>
                    <div class="name">手机</div>
                    <div class="fontclass">#icon-shouji1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-rdsyunshujukuSQLban"></use>
                    </svg>
                    <div class="name">rds 云数据库SQL版</div>
                    <div class="fontclass">#icon-rdsyunshujukuSQLban</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shujuku2"></use>
                    </svg>
                    <div class="name">数据库</div>
                    <div class="fontclass">#icon-shujuku2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wulitu_shujufuwuqi"></use>
                    </svg>
                    <div class="name">物理图_数据服务器</div>
                    <div class="fontclass">#icon-wulitu_shujufuwuqi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-icon--"></use>
                    </svg>
                    <div class="name">放大</div>
                    <div class="fontclass">#icon-icon--</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-icon--1"></use>
                    </svg>
                    <div class="name">消息</div>
                    <div class="fontclass">#icon-icon--1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-paihangshuju"></use>
                    </svg>
                    <div class="name">排行数据</div>
                    <div class="fontclass">#icon-paihangshuju</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dituzuobiao"></use>
                    </svg>
                    <div class="name">地图坐标</div>
                    <div class="fontclass">#icon-dituzuobiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-ditu1"></use>
                    </svg>
                    <div class="name">地图</div>
                    <div class="fontclass">#icon-ditu1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-piliangyiku"></use>
                    </svg>
                    <div class="name">批量移库</div>
                    <div class="fontclass">#icon-piliangyiku</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tiaobochuku"></use>
                    </svg>
                    <div class="name">调拨出库</div>
                    <div class="fontclass">#icon-tiaobochuku</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-qitaruku"></use>
                    </svg>
                    <div class="name">其他入库</div>
                    <div class="fontclass">#icon-qitaruku</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-weixianghebing"></use>
                    </svg>
                    <div class="name">尾箱合并</div>
                    <div class="fontclass">#icon-weixianghebing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jiesuo"></use>
                    </svg>
                    <div class="name">解锁</div>
                    <div class="fontclass">#icon-jiesuo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-gaiicon-"></use>
                    </svg>
                    <div class="name">能效服务</div>
                    <div class="fontclass">#icon-gaiicon-</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-daohang-shujufenxi"></use>
                    </svg>
                    <div class="name">数据汇总</div>
                    <div class="fontclass">#icon-daohang-shujufenxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shishishujushouji"></use>
                    </svg>
                    <div class="name">是时数据收集</div>
                    <div class="fontclass">#icon-shishishujushouji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-Find_unclick"></use>
                    </svg>
                    <div class="name">Find_unclick</div>
                    <div class="fontclass">#icon-Find_unclick</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-hdm"></use>
                    </svg>
                    <div class="name">hdm 混合云数据库管理</div>
                    <div class="fontclass">#icon-hdm</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shijian"></use>
                    </svg>
                    <div class="name">时间</div>
                    <div class="fontclass">#icon-shijian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xueshengrizhi"></use>
                    </svg>
                    <div class="name">学生日志</div>
                    <div class="fontclass">#icon-xueshengrizhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-weibiaoti-"></use>
                    </svg>
                    <div class="name">时钟</div>
                    <div class="fontclass">#icon-weibiaoti-</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wendang4"></use>
                    </svg>
                    <div class="name">文档</div>
                    <div class="fontclass">#icon-wendang4</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zuzhixietiaonengli"></use>
                    </svg>
                    <div class="name">组织协调能力</div>
                    <div class="fontclass">#icon-zuzhixietiaonengli</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-gerenzhiyeguihua"></use>
                    </svg>
                    <div class="name">个人职业规划 </div>
                    <div class="fontclass">#icon-gerenzhiyeguihua</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tuanduiguanli"></use>
                    </svg>
                    <div class="name">团队管理</div>
                    <div class="fontclass">#icon-tuanduiguanli</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tuanduijianshe"></use>
                    </svg>
                    <div class="name">团队建设</div>
                    <div class="fontclass">#icon-tuanduijianshe</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yifahuo"></use>
                    </svg>
                    <div class="name">已发货</div>
                    <div class="fontclass">#icon-yifahuo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dizhi"></use>
                    </svg>
                    <div class="name">地址</div>
                    <div class="fontclass">#icon-dizhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-icon"></use>
                    </svg>
                    <div class="name">关系网络图</div>
                    <div class="fontclass">#icon-icon</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-antdesign"></use>
                    </svg>
                    <div class="name">ant design</div>
                    <div class="fontclass">#icon-antdesign</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-API"></use>
                    </svg>
                    <div class="name">API</div>
                    <div class="fontclass">#icon-API</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-bulb"></use>
                    </svg>
                    <div class="name">bulb</div>
                    <div class="fontclass">#icon-bulb</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-calendar"></use>
                    </svg>
                    <div class="name">calendar</div>
                    <div class="fontclass">#icon-calendar</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-clock-circle-o"></use>
                    </svg>
                    <div class="name">clock-circle-o</div>
                    <div class="fontclass">#icon-clock-circle-o</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-close-circle-o"></use>
                    </svg>
                    <div class="name">close-circle-o</div>
                    <div class="fontclass">#icon-close-circle-o</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dashboard"></use>
                    </svg>
                    <div class="name">dashboard</div>
                    <div class="fontclass">#icon-dashboard</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-error"></use>
                    </svg>
                    <div class="name">error</div>
                    <div class="fontclass">#icon-error</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-exclamation-circle-o"></use>
                    </svg>
                    <div class="name">exclamation-circle-o</div>
                    <div class="fontclass">#icon-exclamation-circle-o</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-find"></use>
                    </svg>
                    <div class="name">find</div>
                    <div class="fontclass">#icon-find</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-folder"></use>
                    </svg>
                    <div class="name">folder</div>
                    <div class="fontclass">#icon-folder</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-indent-left"></use>
                    </svg>
                    <div class="name">indent-left</div>
                    <div class="fontclass">#icon-indent-left</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-indent-right"></use>
                    </svg>
                    <div class="name">indent-right</div>
                    <div class="fontclass">#icon-indent-right</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-laptop"></use>
                    </svg>
                    <div class="name">laptop</div>
                    <div class="fontclass">#icon-laptop</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-layout"></use>
                    </svg>
                    <div class="name">layout</div>
                    <div class="fontclass">#icon-layout</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shezhi"></use>
                    </svg>
                    <div class="name">设置</div>
                    <div class="fontclass">#icon-shezhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-weixiu"></use>
                    </svg>
                    <div class="name">维修</div>
                    <div class="fontclass">#icon-weixiu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-file-add"></use>
                    </svg>
                    <div class="name">file-add</div>
                    <div class="fontclass">#icon-file-add</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-folder-add"></use>
                    </svg>
                    <div class="name">folder-add</div>
                    <div class="fontclass">#icon-folder-add</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-folder-open"></use>
                    </svg>
                    <div class="name">folder-open</div>
                    <div class="fontclass">#icon-folder-open</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon--jiangbei"></use>
                    </svg>
                    <div class="name">09-奖杯</div>
                    <div class="fontclass">#icon--jiangbei</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon--bingzhuangtu"></use>
                    </svg>
                    <div class="name">14-饼状图</div>
                    <div class="fontclass">#icon--bingzhuangtu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-anquan"></use>
                    </svg>
                    <div class="name">安全</div>
                    <div class="fontclass">#icon-anquan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wenjianjia"></use>
                    </svg>
                    <div class="name">文件夹</div>
                    <div class="fontclass">#icon-wenjianjia</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yunshangchuan"></use>
                    </svg>
                    <div class="name">云上传</div>
                    <div class="fontclass">#icon-yunshangchuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shujuwajue"></use>
                    </svg>
                    <div class="name">数据挖掘</div>
                    <div class="fontclass">#icon-shujuwajue</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shujujianmo"></use>
                    </svg>
                    <div class="name">数据建模</div>
                    <div class="fontclass">#icon-shujujianmo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xietongwendang"></use>
                    </svg>
                    <div class="name">协同文档</div>
                    <div class="fontclass">#icon-xietongwendang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yijianfenxi"></use>
                    </svg>
                    <div class="name">意见分析</div>
                    <div class="fontclass">#icon-yijianfenxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tiaosepan"></use>
                    </svg>
                    <div class="name">调色盘</div>
                    <div class="fontclass">#icon-tiaosepan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-huoche"></use>
                    </svg>
                    <div class="name">货车</div>
                    <div class="fontclass">#icon-huoche</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jingcha"></use>
                    </svg>
                    <div class="name">警察</div>
                    <div class="fontclass">#icon-jingcha</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-lahuoche"></use>
                    </svg>
                    <div class="name">拉货车</div>
                    <div class="fontclass">#icon-lahuoche</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shujuku"></use>
                    </svg>
                    <div class="name">数据库</div>
                    <div class="fontclass">#icon-shujuku</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fuwuqi"></use>
                    </svg>
                    <div class="name">服务器</div>
                    <div class="fontclass">#icon-fuwuqi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fuwuqi_hover"></use>
                    </svg>
                    <div class="name">服务器_hover</div>
                    <div class="fontclass">#icon-fuwuqi_hover</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fuwuqizu"></use>
                    </svg>
                    <div class="name">服务器组</div>
                    <div class="fontclass">#icon-fuwuqizu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fuwuqizu_hover"></use>
                    </svg>
                    <div class="name">服务器组_hover</div>
                    <div class="fontclass">#icon-fuwuqizu_hover</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shangyun"></use>
                    </svg>
                    <div class="name">上云</div>
                    <div class="fontclass">#icon-shangyun</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shangyun_hover"></use>
                    </svg>
                    <div class="name">上云_hover</div>
                    <div class="fontclass">#icon-shangyun_hover</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wenjian"></use>
                    </svg>
                    <div class="name">文件</div>
                    <div class="fontclass">#icon-wenjian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wenjian_hover"></use>
                    </svg>
                    <div class="name">文件_hover</div>
                    <div class="fontclass">#icon-wenjian_hover</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yingpan"></use>
                    </svg>
                    <div class="name">硬盘</div>
                    <div class="fontclass">#icon-yingpan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yingpanfuzhi"></use>
                    </svg>
                    <div class="name">硬盘复制</div>
                    <div class="fontclass">#icon-yingpanfuzhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yingpanfuzhi_hover"></use>
                    </svg>
                    <div class="name">硬盘复制_hover</div>
                    <div class="fontclass">#icon-yingpanfuzhi_hover</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yunzhuji"></use>
                    </svg>
                    <div class="name">云主机</div>
                    <div class="fontclass">#icon-yunzhuji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yunzhuji_hover"></use>
                    </svg>
                    <div class="name">云主机_hover</div>
                    <div class="fontclass">#icon-yunzhuji_hover</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiangzuojiantou"></use>
                    </svg>
                    <div class="name">向左箭头</div>
                    <div class="fontclass">#icon-xiangzuojiantou</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tubiaozhizuomoban-zitibianda"></use>
                    </svg>
                    <div class="name">图标制作模版-字体变大</div>
                    <div class="fontclass">#icon-tubiaozhizuomoban-zitibianda</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tubiaozhizuomoban-zitibianxiao"></use>
                    </svg>
                    <div class="name">图标制作模版-字体变小</div>
                    <div class="fontclass">#icon-tubiaozhizuomoban-zitibianxiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tubiaozhizuomoban-wenjianjia"></use>
                    </svg>
                    <div class="name">图标制作模版-文件夹</div>
                    <div class="fontclass">#icon-tubiaozhizuomoban-wenjianjia</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tubiaozhizuomoban-tuxing"></use>
                    </svg>
                    <div class="name">图标制作模版-图形</div>
                    <div class="fontclass">#icon-tubiaozhizuomoban-tuxing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-whg-jiansuo"></use>
                    </svg>
                    <div class="name">图标制作模版-检索</div>
                    <div class="fontclass">#icon-whg-jiansuo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-whg-dituweizhi"></use>
                    </svg>
                    <div class="name">whg-地图位置</div>
                    <div class="fontclass">#icon-whg-dituweizhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-whg-xiangji"></use>
                    </svg>
                    <div class="name">whg-相机</div>
                    <div class="fontclass">#icon-whg-xiangji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-whg-chuizhi"></use>
                    </svg>
                    <div class="name">whg-垂直</div>
                    <div class="fontclass">#icon-whg-chuizhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-whg-shuiping"></use>
                    </svg>
                    <div class="name">whg-水平</div>
                    <div class="fontclass">#icon-whg-shuiping</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-whg-fangda"></use>
                    </svg>
                    <div class="name">whg-放大</div>
                    <div class="fontclass">#icon-whg-fangda</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-whg-suoxiao"></use>
                    </svg>
                    <div class="name">whg-缩小</div>
                    <div class="fontclass">#icon-whg-suoxiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-whg-kuangxuan"></use>
                    </svg>
                    <div class="name">whg-框选</div>
                    <div class="fontclass">#icon-whg-kuangxuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-whg-pengzhuang"></use>
                    </svg>
                    <div class="name">whg-碰撞</div>
                    <div class="fontclass">#icon-whg-pengzhuang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-whg-pengzhuang1"></use>
                    </svg>
                    <div class="name">whg-碰撞2</div>
                    <div class="fontclass">#icon-whg-pengzhuang1</div>
                </li>
            
        </ul>


        <h2 id="symbol-">symbol引用</h2>
        <hr>

        <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
        这种用法其实是做了一个svg的集合，与另外两种相比具有如下特点：</p>
        <ul>
          <li>支持多色图标了，不再受单色限制。</li>
          <li>通过一些技巧，支持像字体那样，通过<code>font-size</code>,<code>color</code>来调整样式。</li>
          <li>兼容性较差，支持 ie9+,及现代浏览器。</li>
          <li>浏览器渲染svg的性能一般，还不如png。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-symbol-">第一步：引入项目下面生成的symbol代码：</h3>
        <pre><code class="lang-js hljs javascript"><span class="hljs-comment">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;</span></code></pre>
        <h3 id="-css-">第二步：加入通用css代码（引入一次就行）：</h3>
        <pre><code class="lang-js hljs javascript">&lt;style type=<span class="hljs-string">"text/css"</span>&gt;
.icon {
   width: <span class="hljs-number">1</span>em; height: <span class="hljs-number">1</span>em;
   vertical-align: <span class="hljs-number">-0.15</span>em;
   fill: currentColor;
   overflow: hidden;
}
&lt;<span class="hljs-regexp">/style&gt;</span></code></pre>
        <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
        <pre><code class="lang-js hljs javascript">&lt;svg <span class="hljs-class"><span class="hljs-keyword">class</span></span>=<span class="hljs-string">"icon"</span> aria-hidden=<span class="hljs-string">"true"</span>&gt;<span class="xml"><span class="hljs-tag">
  &lt;<span class="hljs-name">use</span> <span class="hljs-attr">xlink:href</span>=<span class="hljs-string">"#icon-xxx"</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">use</span>&gt;</span>
</span>&lt;<span class="hljs-regexp">/svg&gt;
        </span></code></pre>
    </div>
</body>
</html>
